{extend name="public:penbase" /}
{block name="header"}
{include file="public/pentop-nav" /}
{/block}
{block name="content"}
<div class="weui-tab__panel" style="background: #f5f5f5">
    <div class="order-info">
        <p>订单编号： 415257513567170998833</p>

        <p>购买数量： 2000</p>

        <p>交易状态： 待付款</p>
    </div>
    <div class="order-form">
        <h4>订单信息</h4>

        <div class="yl-order-cells">
            <input type="text" placeholder="姓名"/>
            <input type="text" placeholder="EHT账号" style="margin-left: 10px;"/>
        </div>
        <div class="yl-order-cells">
            <input type="text" placeholder="联系电话"/>
            <input type="text" placeholder="邮箱" style="margin-left: 10px;"/>
        </div>
        <div class="yl-order-cell">
            <input type="text" placeholder="银行卡号"/>
        </div>
        <div class="yl-order-cell">
            <input type="text" placeholder="开户行"/>
        </div>
        <div class="yl-order-cells">
            <input type="text" placeholder="开户姓名"/>
            <input type="text" placeholder="支护宝" style="margin-left: 10px;"/>
        </div>
    </div>
    <div class="order-form">
        <h4>选择</h4>

        <div class="weui-cells_radio">
            <label class="weui-cell weui-check__label" for="x11">
                <div class="weui-cell__bd">
                    <p>付 款</p>
                </div>
                <div class="weui-cell__ft">
                    <input type="radio" class="weui-check" name="radio1" id="x11">
                    <span class="weui-icon-checked"></span>
                </div>
            </label>
            <label class="weui-cell weui-check__label" for="x12">

                <div class="weui-cell__bd">
                    <p>放 弃</p>
                </div>
                <div class="weui-cell__ft">
                    <input type="radio" name="radio1" class="weui-check" id="x12" checked="checked">
                    <span class="weui-icon-checked"></span>
                </div>
            </label>
        </div>
    </div>
    <div class="order-form">
        <h4>支付凭证</h4>
        <input type="file" name="pic" id="pic" accept="image/gif, image/jpeg"/>
    </div>
    <div class="order-form">
        <button>提 交</button>
    </div>

</div>

<script src="__PUBLIC__/pension/js/swiper.min.js"></script>
<script src="__PUBLIC__/pension/js/zepto.min.js"></script>
<script src="__PUBLIC__/pension/js/weui.min.js"></script>
<!--<script src="__PUBLIC__/pension/js/fastclick.min.js"></script>-->
<script src="__PUBLIC__/pension/js/clipboard.min.js"></script>
<script>
    $(function () {
        var tmpl = '<li class="weui-uploader__file" style="background-image:url(#url#)"></li>',
                $gallery = $("#gallery"), $galleryImg = $("#galleryImg"),
                $uploaderInput = $("#uploaderInput"),
                $uploaderFiles = $("#uploaderFiles")
                ;

        $uploaderInput.on("change", function (e) {
            var src, url = window.URL || window.webkitURL || window.mozURL, files = e.target.files;
            for (var i = 0, len = files.length; i < len; ++i) {
                var file = files[i];

                if (url) {
                    src = url.createObjectURL(file);
                } else {
                    src = e.target.result;
                }

                $uploaderFiles.append($(tmpl.replace('#url#', src)));
            }
        });
        $uploaderFiles.on("click", "li", function () {
            $galleryImg.attr("style", this.getAttribute("style"));
            $gallery.fadeIn(100);
        });
        $gallery.on("click", function () {
            $gallery.fadeOut(100);
        });

    });


</script>
{/block}